import PropTypes from 'prop-types'
import { useRequest } from 'alova'
import { App, Button, Result } from 'antd'

import { Http } from '../../Api'

const DeleteModal = ({ data, Off }) => {
    DeleteModal.propTypes = {
        data: PropTypes.object,
        Off: PropTypes.func
    }
    const { path, url, actionRef } = data
    const { notification } = App.useApp()
    const { send } = useRequest(() => Http({ url, path }), { immediate: false })

    const onDelete = () => {
        send().then(() => {
            notification.info({ key: 'delete', message: '数据删除成功', description: '如数据未自动刷新,请手动刷新' })
            actionRef.current.reload()
            Off()
        })
    }


    return (
        <div className='DeleteModal'>
            <Result
                status="warning"
                title="是否要从数据中删除本条数据? 删除后将不可恢复!"
                extra={[
                    <Button type="primary" key="delete" danger size='large' onClick={onDelete}>
                        删除
                    </Button>,
                    <Button type="primary" key="close" size='large' onClick={Off}>
                        取消
                    </Button>
                ]}
            />
        </div>
    );
};

export default DeleteModal;